<template>
  <div>
    <!-- 用户信息部分 -->
    <userDetail
      @getFollowsPageInfo="pushFollowsPage"
      @getSongerDetailInfo="pushSongerDetailPage"
      @getFollowedsPageInfo="pushFollowedsPage"
    ></userDetail>

    <!-- 用户歌单 -->
    <userMusicList @getSonglistId="toSonglistPage"></userMusicList>
  </div>
</template>

<script>
import userDetail from './userdetailtemplate/userdetail'
import userMusicList from './userdetailtemplate/usermusiclist'

import { mapMutations } from 'vuex'

export default {
  components: { userDetail, userMusicList },

  data() {
    return {}
  },
  created() {
    this.routerIsActiveInfo()
  },
  methods: {
    ...mapMutations(['changeIsActive']),

    // 跳转到歌单页面
    toSonglistPage(data) {
      // console.log(data)
      this.$emit('getSonglistId', data)
    },
    //  侧边栏信息
    routerIsActiveInfo() {
      const isActive = ''
      this.changeIsActive(isActive)
    },
    // 子传父函数, 传递关注页面信息
    pushFollowsPage(data) {
      this.$emit('getFollowsPageInfo', data)
    },
    // 子传父函数, 传递粉丝页面信息
    pushFollowedsPage(data) {
      this.$emit('getFollowedsPageInfo', data)
    },
    // 子传父函数, 传递歌手页面信息
    pushSongerDetailPage(data) {
      this.$emit('getSongerDetailInfo', data)
    },
  },
}
</script>

<style lang="less" scoped>
</style>